<template>
  <div>
     <h4>{{ mytitle }}</h4>
    <van-swipe :loop="false" :width="300" :show-indicators=false>
      <van-swipe-item  v-for="(item) in topicList" :key="item.id" >
        <img :src="item.item_pic_url" alt="">
        <p>{{item.title}}<span>{{item.price_info |Money}}</span></p>
        <p>{{item.subtitle}}</p>
      </van-swipe-item>
    </van-swipe>
  </div>
</template>

<script>
export default {
  name: "",
  props: ["topicList"],
  data() {
    return {
        mytitle:'专题精选'
    };
  },

  components: {},

  computed: {},

  created() {},

  mounted() {},

  methods: {},
};
</script>
<style lang='less' scoped>
h4{
   text-align: center;
  height: 50px;
  line-height: 50px;
  font-size: 18px;
}
.van-swipe-item {
  margin-right: 10px;
  margin-left: 10px;
  img{
    display: block;
    width: 100%;
    height: 200px;
    // margin-right: 20px;
     }
  p{
    line-height: 20px;
    font-size: 16px;
    margin-top: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    span{
      color: darkred;
    }
  }

}

</style>